import 'package:ecy_app_flutter/routes/goods/widgets/common/Debouncer.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import '../../EcyRouter.dart';
import '../../ecycommon/EcyCommonWidgets.dart';
import 'EcyGroupListPage.dart';

class EcyGroupSearchPage extends EcyCommonBaseWidget {
  EcyGroupSearchPage({required super.key});

  @override
  _EcyGroupSearchPageState createState() {
    return _EcyGroupSearchPageState(this);
  }
}

class _EcyGroupSearchPageState extends EcyCommonBaseWidgetState {
  String searchKey = "";
  final Debounce debounce = Debounce();
  late EcyCommonBaseWidget controller;

  _EcyGroupSearchPageState(EcyCommonBaseWidget vc) {
    controller = vc;
  }

  final TextEditingController _searchController = TextEditingController();
  final EcyGroupListPage searchGroupListPage = EcyGroupListPage("1", false, key: const Key("searchGroupListPage"),);

  @override
  void initState() {
    super.initState();
  }

  void searchData() async {
    if(_searchController.text.isNotEmpty) {
      searchGroupListPage.reloadData(_searchController.text);
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: const Color(0XFFf5f5f5),
        appBar: AppBar(
          backgroundColor: Colors.white,
          automaticallyImplyLeading: false,
          titleSpacing: 0,
          title: Align(
            alignment: Alignment.center,
            child: Wrap(
              alignment: WrapAlignment.spaceBetween,
              direction: Axis.horizontal,
              spacing: 10.w,
              crossAxisAlignment: WrapCrossAlignment.center,
              children: [
                Container(
                    height: 36.w,
                    alignment: Alignment.center,
                    margin: EdgeInsets.only(left: 10.w),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.all(Radius.circular(8.r)),
                      color: const Color(0x0A000000), //设置背景色为黑色
                    ),
                    width: MediaQuery.of(context).size.width - 60.w,
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      children: <Widget>[
                        Padding(padding: EdgeInsets.only(left: 5.w)),
                        Image(
                            image: const AssetImage(
                                'assets/images/ic_home_search.png'),
                            width: 24.w,
                            height: 24.w),
                        // 左侧图标按钮
                        Expanded(
                          // 使TextField扩展剩余空间
                          child: Container(
                              alignment:Alignment.center,
                              // margin: EdgeInsets.only(left: 4.w, bottom: 4.h),
                              height: 36.w,
                              child: TextField(
                                controller: _searchController,
                                autofocus: true,
                                textAlignVertical: TextAlignVertical.center,
                                decoration: InputDecoration(
                                  isCollapsed: true,
                                  hintText: "搜索",
                                  hintStyle: TextStyle(
                                      fontSize: 16.sp,
                                      fontWeight: FontWeight.w300,
                                      color: const Color(0x73000000)),
                                  border:
                                      InputBorder.none, // 移除默认边框，因为我们使用了Row布局
                                ),
                                onChanged: (String value) {
                                  debounce.setDuration(
                                      const Duration(milliseconds: 300), () {
                                    searchKey = value;
                                    searchData();
                                  });
                                },
                              )),
                        ),
                        IconButton(
                            icon: const Icon(
                              Icons.clear,
                              color: Color(0x73000000),
                            ),
                            onPressed: () {
                              setState(() {
                                _searchController.text = "";
                              });
                            }), // 右侧图标按钮
                      ],
                    )),
                GestureDetector(
                    onTap: () {
                      EcyRouter.pop(context, "");
                    },
                    child: Text("取消",
                        textAlign: TextAlign.center,
                        style: TextStyle(
                            fontWeight: FontWeight.w400,
                            fontSize: 16.sp,
                            color: const Color(0xD9000000)))),
              ],
            ),
          ),
        ),
        body: Padding(
          padding: const EdgeInsets.all(8),
          child: searchGroupListPage,
        ));
  }

  @override
  void dispose() {
    // 清理控制器，避免内存泄漏
    debounce.clear();
    _searchController.dispose();
    super.dispose();
  }
}
